import { VC, Component } from '@/VC-vue'
import './index.styl'
import { login } from '../../services/control'
import { Toast } from 'mand-mobile'

@Component({})
export default class Index extends VC {
    editInfo: any = {}
    renderLogin() {
        return (
            <div class="login_main">
                <div class="login_title">登录</div>
                <md-field>
                    <md-input-item
                        ref="name"
                        title="用户名"
                        placeholder="请输入用户名"
                        is-title-latent
                        clearable
                        v-model={this.editInfo.operatorCode}
                    />
                    <md-input-item
                        ref="id"
                        title="密码"
                        placeholder="请输入密码"
                        type="password"
                        is-title-latent
                        v-model={this.editInfo.password}
                        clearable
                    />
                </md-field>
                <div class="login_action">
                    <div class="login_btn" onclick={this.handleLogin}>
                        立即登录
                    </div>
                </div>
            </div>
        )
    }

    handleLogin() {
        Toast.loading('登录中...')
        login(this.editInfo).then((res: any) => {
            if (res.data.operatorId) {
                setTimeout(() => {
                    Toast.succeed('登录成功~', 1000)
                    localStorage.setItem('operatorId', res.data.operatorId)
                    setTimeout(() => {
                        this.$router.push('/')
                    }, 1000)
                }, 2000)
            }
        })
    }

    navigateTo(path: string) {
        this.$router.push({
            path
        })
    }

    render() {
        return <div class="login_container">{this.renderLogin()}</div>
    }
}
